<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" >

	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
	<link href="https://fonts.googleapis.com/css?family=Roboto+Mono" rel="stylesheet">
	<link href="https://fonts.googleapis.com/css?family=Cousine|Inconsolata" rel="stylesheet">
	<link rel="shortcut icon" type="image/png" href="/favicon.png">

	
	<link rel="stylesheet" href="/css/style.css">
	<link rel="stylesheet" href="/css/css/fontawesome-all.min.css">
	<script src="/js/main.js"></script>
	

	<!-- Begin Jekyll SEO tag v2.1.0 -->
<title>JS: Get Account Comments - Steem Developer</title>
<meta property="og:title" content="JS: Get Account Comments" />
<meta name="description" content="By the end of this tutorial you should know how to retrieve account comments from the steem blockchain" />
<meta property="og:description" content="By the end of this tutorial you should know how to retrieve account comments from the steem blockchain" />
<link rel="canonical" href="https://developer.steem.io/tutorials-javascript/get_account_comments" />
<meta property="og:url" content="https://developer.steem.io/tutorials-javascript/get_account_comments" />
<meta property="og:site_name" content="Steem Developer" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2018-07-20T12:56:08-05:00" />
<script type="application/ld+json">
{"@context": "http://schema.org",
"@type": "BlogPosting",
"headline": "JS: Get Account Comments",
"datePublished": "2018-07-20T12:56:08-05:00",
"description": "By the end of this tutorial you should know how to retrieve account comments from the steem blockchain",
"url": "https://developer.steem.io/tutorials-javascript/get_account_comments"}</script>
<!-- End Jekyll SEO tag -->


	
</head>
<body>
<header>
	<h1>
		<button type="button" class="open-nav" id="open-nav"></button>
		<a href="/"  class="logo-link"><img src="/images/logotype_white.svg" height="40" alt="Steem Developer logo"></a>
	</h1>

	
	<form action="/search/" method="get">
		<input type="text" name="q" id="search-input" placeholder="Search">
		<input type="submit" value="Search" style="display: none;">
	</form>
	

	<div id="sidebar" class="sidebar">
	
	
	
		
    <section class="pnl-main-nav-section main-nav-section" url="/">
		<h6 class="ctrl-nav-section title">Introduction</h6>
		<ul class="cont-nav-section content">
			
				
					
					
						
						<li><a href="/#introduction-welcome">Welcome to Steem</a></li>
						
					
				
			
		</ul>
	</section>
	
		
    <section class="pnl-main-nav-section main-nav-section" url="/quickstart/">
		<h6 class="ctrl-nav-section title">Quickstart</h6>
		<ul class="cont-nav-section content">
			
				
					
					
						
						<li><a href="/quickstart/#quickstart-choose-library">Choose Library</a></li>
						
					
						
						<li><a href="/quickstart/#quickstart-steemd-nodes">steemd Nodes</a></li>
						
					
						
						<li><a href="/quickstart/#quickstart-testnet">Steem Testnet</a></li>
						
					
				
			
		</ul>
	</section>
	
		
    <section class="pnl-main-nav-section main-nav-section" url="/tutorials/">
		<h6 class="ctrl-nav-section title">Tutorials</h6>
		<ul class="cont-nav-section content">
			
				
					
						<li><a href="/tutorials/#tutorials-javascript">Javascript</a></li>
					
				
					
						<li><a href="/tutorials/#tutorials-python">Python</a></li>
					
				
					
						<li><a href="/tutorials/#tutorials-ruby">Ruby</a></li>
					
				
					
						<li><a href="/tutorials/#tutorials-recipes">Recipes</a></li>
					
				
			
		</ul>
	</section>
	
		
    <section class="pnl-main-nav-section main-nav-section" url="/services/">
		<h6 class="ctrl-nav-section title">Services</h6>
		<ul class="cont-nav-section content">
			
				
					
					
						
						<li><a href="/services/#services-steemit">Steemit.com</a></li>
						
					
						
						<li><a href="/services/#services-steemconnect">SteemConnect</a></li>
						
					
						
						<li><a href="/services/#services-jussi">jussi</a></li>
						
					
						
						<li><a href="/services/#services-imagehoster">ImageHoster</a></li>
						
					
						
						<li><a href="/services/#services-sbds">SBDS</a></li>
						
					
				
			
		</ul>
	</section>
	
		
    <section class="pnl-main-nav-section main-nav-section" url="/apidefinitions/">
		<h6 class="ctrl-nav-section title">Appbase API</h6>
		<ul class="cont-nav-section content">
			
				
					
					
						
						<li><a href="/apidefinitions/#apidefinitions-condenser-api">Condenser Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-account-by-key-api">Account By Key Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-broadcast-ops-comment">Broadcast Ops Comment</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-account-history-api">Account History Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-database-api">Database Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-follow-api">Follow Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-jsonrpc">Jsonrpc</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-market-history-api">Market History Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-network-broadcast-api">Network Broadcast Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-tags-api">Tags Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-witness-api">Witness Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-block-api">Block Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-broadcast-ops">Broadcast Ops</a></li>
						
					
				
			
		</ul>
	</section>
	
		
    <section class="pnl-main-nav-section main-nav-section" url="/community/">
		<h6 class="ctrl-nav-section title">Community</h6>
		<ul class="cont-nav-section content">
			
				
					
					
						
						<li><a href="/community/#community-overview">Overview</a></li>
						
					
						
						<li><a href="/community/#community-resources">Resources</a></li>
						
					
						
						<li><a href="/community/#community-developeradvocate">Sharing & Help</a></li>
						
					
				
			
		</ul>
	</section>
	
		
    <section class="pnl-main-nav-section main-nav-section" url="/glossary/">
		<h6 class="ctrl-nav-section title">Glossary</h6>
		<ul class="cont-nav-section content">
			
				
					
					
						
						<li><a href="/glossary/#glossary-chain-basics">Chain Basics</a></li>
						
					
						
					
						
						<li><a href="/glossary/#glossary-governance">Governance</a></li>
						
					
						
						<li><a href="/glossary/#glossary-transactions">Transactions</a></li>
						
					
						
						<li><a href="/glossary/#glossary-api">API</a></li>
						
					
						
						<li><a href="/glossary/#glossary-market">Market</a></li>
						
					
				
			
		</ul>
	</section>
	
</div>


	<!--<p class="copyright">-->
	<!--<a href="https://steemit.com.com/">-->
	<!--steemit-->
	<!--</a>-->
	<!--</p>-->
	<link href="https://fonts.googleapis.com/css?family=Nunito" rel="stylesheet">
</header>
<div class="main" id="top">
	<div class="hero">
		<h1 class="hero__h1">Steem Developer Portal </h1>
		
		<img class="hero__img" src="/images/hero.png">
		
	</div>
	<section id="tutorials-javascript-get-account-comments" class="row tutorials-javascript-get-account-comments">
	<h3>
		<a id="tutorials-javascript-get-account-comments">
			JS: Get Account Comments
			
		</a>
	</h3>
	
		<p class="description">By the end of this tutorial you should know how to retrieve account comments from the steem blockchain</p>
	

	<p><span class="fa-pull-left top-of-tutorial-repo-link"><span class="first-word">Full</span>, runnable src of <a href="https://github.com/steemit/devportal-tutorials-js/tree/master/tutorials/09_get_account_comments">Get Account Comments</a> can be downloaded as part of the <a href="https://github.com/steemit/devportal-tutorials-js">JS tutorials repository</a>.</span>
<br /></p>

<p>This tutorial will show how to fetch comments made by a specific account (in this case <code class="highlighter-rouge">@steemitblog</code>) by demonstrating how to use the <code class="highlighter-rouge">get_state</code> api function call. We will also demonstrate the most commonly used fields from the response object as well as how to parse the body of each comment.</p>

<h2 id="intro">Intro</h2>

<p>We are using the <code class="highlighter-rouge">get_state</code> function with <code class="highlighter-rouge">dsteem</code> that returns the current state of the network as well as additional content. Each content body is written in markdown and could be submitted to the blockchain by many different applications built on top of Steem. For that reason we are using the <code class="highlighter-rouge">remarkable</code> npm package to parse markdown in a readable format.</p>

<h2 id="steps">Steps</h2>

<ol>
  <li><a href="#app-setup"><strong>App setup</strong></a> Configuration of <code class="highlighter-rouge">dsteem</code> to use the proper connection and network.</li>
  <li><a href="#query"><strong>Query</strong></a> Query the path which we want to extract from Steem blockchain state.</li>
  <li><a href="#formatting"><strong>Formatting</strong></a> Formatting the JSON object to be viewed in a simple user interface.</li>
</ol>

<h4 id="1-app-setup">1. App setup<a name="app-setup"></a></h4>

<p>Below we have <code class="highlighter-rouge">dsteem</code> pointing to the main network with the proper chainId, addressPrefix and connection server.
There is a <code class="highlighter-rouge">public/app.js</code> file which holds the Javascript segment of this tutorial. In the first few lines we define and configure library and packages.</p>

<div class="language-javascript highlighter-rouge"><pre class="highlight"><code><span class="kr">const</span> <span class="nx">dsteem</span> <span class="o">=</span> <span class="nx">require</span><span class="p">(</span><span class="s1">'dsteem'</span><span class="p">);</span>
<span class="kd">let</span> <span class="nx">opts</span> <span class="o">=</span> <span class="p">{};</span>
<span class="c1">//connect to production server</span>
<span class="nx">opts</span><span class="p">.</span><span class="nx">addressPrefix</span> <span class="o">=</span> <span class="s1">'STM'</span><span class="p">;</span>
<span class="nx">opts</span><span class="p">.</span><span class="nx">chainId</span> <span class="o">=</span>
    <span class="s1">'0000000000000000000000000000000000000000000000000000000000000000'</span><span class="p">;</span>
<span class="c1">//connect to server which is connected to the network/production</span>
<span class="kr">const</span> <span class="nx">client</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">dsteem</span><span class="p">.</span><span class="nx">Client</span><span class="p">(</span><span class="s1">'https://api.steemit.com'</span><span class="p">);</span>

<span class="kr">const</span> <span class="nx">Remarkable</span> <span class="o">=</span> <span class="nx">require</span><span class="p">(</span><span class="s1">'remarkable'</span><span class="p">);</span>
<span class="kr">const</span> <span class="nx">md</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Remarkable</span><span class="p">({</span> <span class="na">html</span><span class="p">:</span> <span class="kc">true</span><span class="p">,</span> <span class="na">linkify</span><span class="p">:</span> <span class="kc">true</span> <span class="p">});</span>
</code></pre>
</div>

<p><code class="highlighter-rouge">remarkable</code> is assigned to the variable <code class="highlighter-rouge">md</code> with linkify and html options, allowing us to parse markdown links and html properly.</p>

<h4 id="2-query">2. Query<a name="query"></a></h4>

<p>Next, we have the <code class="highlighter-rouge">main</code> function which runs when the page is loaded.</p>

<div class="language-javascript highlighter-rouge"><pre class="highlight"><code><span class="c1">// query string, fetching comments made by @steemitblog account</span>
<span class="kr">const</span> <span class="nx">query</span> <span class="o">=</span> <span class="s1">'/@steemitblog/comments'</span><span class="p">;</span>

<span class="nx">client</span><span class="p">.</span><span class="nx">database</span><span class="p">.</span><span class="nx">call</span><span class="p">(</span><span class="s1">'get_state'</span><span class="p">,</span> <span class="p">[</span><span class="nx">query</span><span class="p">]).</span><span class="nx">then</span><span class="p">(</span><span class="nx">result</span> <span class="o">=&gt;</span> <span class="p">{</span>
    <span class="c1">// work with state object</span>
<span class="p">});</span>
</code></pre>
</div>

<p><code class="highlighter-rouge">query</code> is the path from where want to extract Steem blockchain state. In our example we are querying <code class="highlighter-rouge">comments</code> from the <code class="highlighter-rouge">@steemitblog</code> account. The result will be the current state object with various information as well as the <code class="highlighter-rouge">content</code> property holding the content of the query.</p>

<p>The following is an example of the returned object:</p>

<div class="language-json highlighter-rouge"><pre class="highlight"><code><span class="p">{</span><span class="w">
    </span><span class="nt">"current_route"</span><span class="p">:</span><span class="s2">"/@steemitblog/comments"</span><span class="p">,</span><span class="w">
    </span><span class="nt">"props"</span><span class="p">:{</span><span class="w">
        </span><span class="nt">"head_block_number"</span><span class="p">:</span><span class="mi">22307429</span><span class="p">,</span><span class="w">
        </span><span class="nt">"head_block_id"</span><span class="p">:</span><span class="s2">"01546265c9dc3e761add4c4b652743e3c640fa19"</span><span class="p">,</span><span class="w">
        </span><span class="nt">"time"</span><span class="p">:</span><span class="s2">"2018-05-10T12:15:30"</span><span class="p">,</span><span class="w">
        </span><span class="nt">"current_witness"</span><span class="p">:</span><span class="s2">"smooth.witness"</span><span class="p">,</span><span class="w">
        </span><span class="nt">"total_pow"</span><span class="p">:</span><span class="mi">514415</span><span class="p">,</span><span class="w">
        </span><span class="nt">"num_pow_witnesses"</span><span class="p">:</span><span class="mi">172</span><span class="p">,</span><span class="w">
        </span><span class="nt">"virtual_supply"</span><span class="p">:</span><span class="s2">"271970374.699 STEEM"</span><span class="p">,</span><span class="w">
        </span><span class="nt">"current_supply"</span><span class="p">:</span><span class="s2">"268140818.508 STEEM"</span><span class="p">,</span><span class="w">
        </span><span class="nt">"confidential_supply"</span><span class="p">:</span><span class="s2">"0.000 STEEM"</span><span class="p">,</span><span class="w">
        </span><span class="nt">"current_sbd_supply"</span><span class="p">:</span><span class="s2">"13342173.771 SBD"</span><span class="p">,</span><span class="w">
        </span><span class="nt">"confidential_sbd_supply"</span><span class="p">:</span><span class="s2">"0.000 SBD"</span><span class="p">,</span><span class="w">
        </span><span class="nt">"total_vesting_fund_steem"</span><span class="p">:</span><span class="s2">"191002132.498 STEEM"</span><span class="p">,</span><span class="w">
        </span><span class="nt">"total_vesting_shares"</span><span class="p">:</span><span class="s2">"388786707656.308148 VESTS"</span><span class="p">,</span><span class="w">
        </span><span class="nt">"total_reward_fund_steem"</span><span class="p">:</span><span class="s2">"0.000 STEEM"</span><span class="p">,</span><span class="w">
        </span><span class="nt">"total_reward_shares2"</span><span class="p">:</span><span class="s2">"0"</span><span class="p">,</span><span class="w">
        </span><span class="nt">"pending_rewarded_vesting_shares"</span><span class="p">:</span><span class="s2">"366359809.533218 VESTS"</span><span class="p">,</span><span class="w">
        </span><span class="nt">"pending_rewarded_vesting_steem"</span><span class="p">:</span><span class="s2">"178575.754 STEEM"</span><span class="p">,</span><span class="w">
        </span><span class="nt">"sbd_interest_rate"</span><span class="p">:</span><span class="mi">0</span><span class="p">,</span><span class="w">
        </span><span class="nt">"sbd_print_rate"</span><span class="p">:</span><span class="mi">10000</span><span class="p">,</span><span class="w">
        </span><span class="nt">"maximum_block_size"</span><span class="p">:</span><span class="mi">65536</span><span class="p">,</span><span class="w">
        </span><span class="nt">"current_aslot"</span><span class="p">:</span><span class="mi">22373110</span><span class="p">,</span><span class="w">
        </span><span class="nt">"recent_slots_filled"</span><span class="p">:</span><span class="s2">"340282366920938463463374607431768211455"</span><span class="p">,</span><span class="w">
        </span><span class="nt">"participation_count"</span><span class="p">:</span><span class="mi">128</span><span class="p">,</span><span class="w">
        </span><span class="nt">"last_irreversible_block_num"</span><span class="p">:</span><span class="mi">22307411</span><span class="p">,</span><span class="w">
        </span><span class="nt">"vote_power_reserve_rate"</span><span class="p">:</span><span class="mi">10</span><span class="p">,</span><span class="w">
        </span><span class="nt">"average_block_size"</span><span class="p">:</span><span class="mi">14881</span><span class="p">,</span><span class="w">
        </span><span class="nt">"current_reserve_ratio"</span><span class="p">:</span><span class="mi">200000000</span><span class="p">,</span><span class="w">
        </span><span class="nt">"max_virtual_bandwidth"</span><span class="p">:</span><span class="s2">"264241152000000000000"</span><span class="w">
    </span><span class="p">},</span><span class="w">
    </span><span class="nt">"tag_idx"</span><span class="p">:{</span><span class="w">
        </span><span class="nt">"trending"</span><span class="p">:[</span><span class="s2">""</span><span class="p">,</span><span class="s2">"life"</span><span class="p">,</span><span class="s2">"photography"</span><span class="p">,</span><span class="s2">"steemit"</span><span class="p">,</span><span class="s2">"kr"</span><span class="p">,</span><span class="s2">"introduceyourself"</span><span class="p">,</span><span class="s2">"bitcoin"</span><span class="p">,</span><span class="s2">"art"</span><span class="p">,</span><span class="s2">"travel"</span><span class="p">,</span><span class="s2">"cryptocurrency"</span><span class="p">,</span><span class="s2">"spanish"</span><span class="p">,</span><span class="s2">"food"</span><span class="p">,</span><span class="s2">"steem"</span><span class="p">,</span><span class="s2">"blog"</span><span class="p">,</span><span class="s2">"funny"</span><span class="p">,</span><span class="s2">"news"</span><span class="p">,</span><span class="s2">"nature"</span><span class="p">,</span><span class="s2">"colorchallenge"</span><span class="p">,</span><span class="s2">"dtube"</span><span class="p">,</span><span class="s2">"indonesia"</span><span class="p">,</span><span class="s2">"story"</span><span class="p">,</span><span class="s2">"cn"</span><span class="p">,</span><span class="s2">"money"</span><span class="p">,</span><span class="s2">"music"</span><span class="p">,</span><span class="s2">"writing"</span><span class="p">,</span><span class="s2">"crypto"</span><span class="p">,</span><span class="s2">"contest"</span><span class="p">,</span><span class="s2">"busy"</span><span class="p">,</span><span class="s2">"health"</span><span class="p">,</span><span class="s2">"poetry"</span><span class="p">,</span><span class="s2">"meme"</span><span class="p">,</span><span class="s2">"video"</span><span class="p">,</span><span class="s2">"utopian-io"</span><span class="p">,</span><span class="s2">"photo"</span><span class="p">,</span><span class="s2">"new"</span><span class="p">,</span><span class="s2">"love"</span><span class="p">,</span><span class="s2">"blockchain"</span><span class="p">,</span><span class="s2">"deutsch"</span><span class="p">,</span><span class="s2">"dmania"</span><span class="p">,</span><span class="s2">"science"</span><span class="p">,</span><span class="s2">"technology"</span><span class="p">,</span><span class="s2">"aceh"</span><span class="p">,</span><span class="s2">"entertainment"</span><span class="p">,</span><span class="s2">"gaming"</span><span class="p">,</span><span class="s2">"politics"</span><span class="p">,</span><span class="s2">"myanmar"</span><span class="p">,</span><span class="s2">"esteem"</span><span class="p">,</span><span class="s2">"sports"</span><span class="p">,</span><span class="s2">"fun"</span><span class="p">,</span><span class="s2">"tr"</span><span class="p">]</span><span class="w">
    </span><span class="p">},</span><span class="w">
    </span><span class="nt">"tags"</span><span class="p">:{},</span><span class="w">
    </span><span class="nt">"content"</span><span class="p">:{</span><span class="w">
        </span><span class="nt">"steemitblog/afm007-re-steemitblog-devportal-update-3-ux-improvements-more-javascript-tutorials-and-more-20180509t050215510z"</span><span class="p">:{</span><span class="w">
            </span><span class="nt">"id"</span><span class="p">:</span><span class="mi">47669989</span><span class="p">,</span><span class="w">
            </span><span class="nt">"author"</span><span class="p">:</span><span class="s2">"steemitblog"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"permlink"</span><span class="p">:</span><span class="s2">"afm007-re-steemitblog-devportal-update-3-ux-improvements-more-javascript-tutorials-and-more-20180509t050215510z"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"category"</span><span class="p">:</span><span class="s2">"steem"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"parent_author"</span><span class="p">:</span><span class="s2">"afm007"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"parent_permlink"</span><span class="p">:</span><span class="s2">"devportal-update-3-ux-improvements-more-javascript-tutorials-and-more"</span><span class="p">,</span><span class="nt">"title"</span><span class="p">:</span><span class="s2">""</span><span class="p">,</span><span class="nt">"body"</span><span class="p">:</span><span class="s2">"I want to learn the Python language."</span><span class="p">,</span><span class="w">
            </span><span class="nt">"json_metadata"</span><span class="p">:</span><span class="s2">"{''}"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"last_update"</span><span class="p">:</span><span class="s2">"2018-05-09T05:02:15"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"created"</span><span class="p">:</span><span class="s2">"2018-05-09T05:02:15"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"active"</span><span class="p">:</span><span class="s2">"2018-05-09T05:02:15"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"last_payout"</span><span class="p">:</span><span class="s2">"1970-01-01T00:00:00"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"depth"</span><span class="p">:</span><span class="mi">1</span><span class="p">,</span><span class="w">
            </span><span class="nt">"children"</span><span class="p">:</span><span class="mi">0</span><span class="p">,</span><span class="w">
            </span><span class="nt">"net_rshares"</span><span class="p">:</span><span class="mi">1057692008</span><span class="p">,</span><span class="w">
            </span><span class="nt">"abs_rshares"</span><span class="p">:</span><span class="mi">1057692008</span><span class="p">,</span><span class="w">
            </span><span class="nt">"vote_rshares"</span><span class="p">:</span><span class="mi">1057692008</span><span class="p">,</span><span class="w">
            </span><span class="nt">"children_abs_rshares"</span><span class="p">:</span><span class="mi">0</span><span class="p">,</span><span class="w">
            </span><span class="nt">"cashout_time"</span><span class="p">:</span><span class="s2">"2018-05-16T05:02:15"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"max_cashout_time"</span><span class="p">:</span><span class="s2">"1969-12-31T23:59:59"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"total_vote_weight"</span><span class="p">:</span><span class="mi">32523</span><span class="p">,</span><span class="w">
            </span><span class="nt">"reward_weight"</span><span class="p">:</span><span class="mi">10000</span><span class="p">,</span><span class="w">
            </span><span class="nt">"total_payout_value"</span><span class="p">:</span><span class="s2">"0.000 SBD"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"curator_payout_value"</span><span class="p">:</span><span class="s2">"0.000 SBD"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"author_rewards"</span><span class="p">:</span><span class="mi">0</span><span class="p">,</span><span class="w">
            </span><span class="nt">"net_votes"</span><span class="p">:</span><span class="mi">1</span><span class="p">,</span><span class="w">
            </span><span class="nt">"root_author"</span><span class="p">:</span><span class="s2">"steemitblog"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"root_permlink"</span><span class="p">:</span><span class="s2">"devportal-update-3-ux-improvements-more-javascript-tutorials-and-more"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"max_accepted_payout"</span><span class="p">:</span><span class="s2">"1000000.000 SBD"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"percent_steem_dollars"</span><span class="p">:</span><span class="mi">10000</span><span class="p">,</span><span class="w">
            </span><span class="nt">"allow_replies"</span><span class="p">:</span><span class="kc">true</span><span class="p">,</span><span class="w">
            </span><span class="nt">"allow_votes"</span><span class="p">:</span><span class="kc">true</span><span class="p">,</span><span class="w">
            </span><span class="nt">"allow_curation_rewards"</span><span class="p">:</span><span class="kc">true</span><span class="p">,</span><span class="w">
            </span><span class="nt">"beneficiaries"</span><span class="p">:[],</span><span class="w">
            </span><span class="nt">"url"</span><span class="p">:</span><span class="s2">"/steem/@steemitblog/devportal-update-3-ux-improvements-more-javascript-tutorials-and-more#@afm007/afm007-re-steemitblog-devportal-update-3-ux-improvements-more-javascript-tutorials-and-more-20180509t050215510z"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"root_title"</span><span class="p">:</span><span class="s2">"DevPortal Update #3: UX Improvements, More Javascript Tutorials and More!"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"pending_payout_value"</span><span class="p">:</span><span class="s2">"0.005 SBD"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"total_pending_payout_value"</span><span class="p">:</span><span class="s2">"0.000 STEEM"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"active_votes"</span><span class="p">:[{</span><span class="nt">"voter"</span><span class="p">:</span><span class="s2">"afm007"</span><span class="p">,</span><span class="nt">"weight"</span><span class="p">:</span><span class="mi">17182</span><span class="p">,</span><span class="nt">"rshares"</span><span class="p">:</span><span class="mi">1057692008</span><span class="p">,</span><span class="nt">"percent"</span><span class="p">:</span><span class="mi">10000</span><span class="p">,</span><span class="nt">"reputation"</span><span class="p">:</span><span class="s2">"855556264424"</span><span class="p">,</span><span class="nt">"time"</span><span class="p">:</span><span class="s2">"2018-05-09T05:18:06"</span><span class="p">}],</span><span class="w">
            </span><span class="nt">"replies"</span><span class="p">:[],</span><span class="w">
            </span><span class="nt">"author_reputation"</span><span class="p">:</span><span class="s2">"855556264424"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"promoted"</span><span class="p">:</span><span class="s2">"0.000 SBD"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"body_length"</span><span class="p">:</span><span class="mi">0</span><span class="p">,</span><span class="w">
            </span><span class="nt">"reblogged_by"</span><span class="p">:[]</span><span class="w">
        </span><span class="p">},</span><span class="w">
        </span><span class="nt">"steemitblog/re-steemitblog-devportal-update-3-ux-improvements-more-javascript-tutorials-and-more-20180509t045305223z"</span><span class="p">:{</span><span class="w">
            </span><span class="nt">"id"</span><span class="p">:</span><span class="mi">47669080</span><span class="p">,</span><span class="w">
            </span><span class="nt">"author"</span><span class="p">:</span><span class="s2">"steemitblog"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"permlink"</span><span class="p">:</span><span class="s2">"re-steemitblog-devportal-update-3-ux-improvements-more-javascript-tutorials-and-more-20180509t045305223z"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"category"</span><span class="p">:</span><span class="s2">"steem"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"parent_author"</span><span class="p">:</span><span class="s2">"andreina89"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"parent_permlink"</span><span class="p">:</span><span class="s2">"devportal-update-3-ux-improvements-more-javascript-tutorials-and-more"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"title"</span><span class="p">:</span><span class="s2">""</span><span class="p">,</span><span class="w">
            </span><span class="nt">"body"</span><span class="p">:</span><span class="s2">"Excellent post very interesting friend, thanks"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"json_metadata"</span><span class="p">:</span><span class="s2">"{\"tags\":[\"steem\"],\"app\":\"steemit/0.1\"}"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"last_update"</span><span class="p">:</span><span class="s2">"2018-05-09T04:53:21"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"created"</span><span class="p">:</span><span class="s2">"2018-05-09T04:53:21"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"active"</span><span class="p">:</span><span class="s2">"2018-05-09T04:53:27"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"last_payout"</span><span class="p">:</span><span class="s2">"1970-01-01T00:00:00"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"depth"</span><span class="p">:</span><span class="mi">1</span><span class="p">,</span><span class="w">
            </span><span class="nt">"children"</span><span class="p">:</span><span class="mi">1</span><span class="p">,</span><span class="w">
            </span><span class="nt">"net_rshares"</span><span class="p">:</span><span class="mi">0</span><span class="p">,</span><span class="w">
            </span><span class="nt">"abs_rshares"</span><span class="p">:</span><span class="mi">0</span><span class="p">,</span><span class="w">
            </span><span class="nt">"vote_rshares"</span><span class="p">:</span><span class="mi">0</span><span class="p">,</span><span class="w">
            </span><span class="nt">"children_abs_rshares"</span><span class="p">:</span><span class="mi">0</span><span class="p">,</span><span class="w">
            </span><span class="nt">"cashout_time"</span><span class="p">:</span><span class="s2">"2018-05-16T04:53:21"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"max_cashout_time"</span><span class="p">:</span><span class="s2">"1969-12-31T23:59:59"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"total_vote_weight"</span><span class="p">:</span><span class="mi">0</span><span class="p">,</span><span class="w">
            </span><span class="nt">"reward_weight"</span><span class="p">:</span><span class="mi">10000</span><span class="p">,</span><span class="w">
            </span><span class="nt">"total_payout_value"</span><span class="p">:</span><span class="s2">"0.000 SBD"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"curator_payout_value"</span><span class="p">:</span><span class="s2">"0.000 SBD"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"author_rewards"</span><span class="p">:</span><span class="mi">0</span><span class="p">,</span><span class="w">
            </span><span class="nt">"net_votes"</span><span class="p">:</span><span class="mi">0</span><span class="p">,</span><span class="w">
            </span><span class="nt">"root_author"</span><span class="p">:</span><span class="s2">"steemitblog"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"root_permlink"</span><span class="p">:</span><span class="s2">"devportal-update-3-ux-improvements-more-javascript-tutorials-and-more"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"max_accepted_payout"</span><span class="p">:</span><span class="s2">"1000000.000 SBD"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"percent_steem_dollars"</span><span class="p">:</span><span class="mi">10000</span><span class="p">,</span><span class="w">
            </span><span class="nt">"allow_replies"</span><span class="p">:</span><span class="kc">true</span><span class="p">,</span><span class="w">
            </span><span class="nt">"allow_votes"</span><span class="p">:</span><span class="kc">true</span><span class="p">,</span><span class="w">
            </span><span class="nt">"allow_curation_rewards"</span><span class="p">:</span><span class="kc">true</span><span class="p">,</span><span class="w">
            </span><span class="nt">"beneficiaries"</span><span class="p">:[],</span><span class="w">
            </span><span class="nt">"url"</span><span class="p">:</span><span class="s2">"/steem/@steemitblog/devportal-update-3-ux-improvements-more-javascript-tutorials-and-more#@andreina89/re-steemitblog-devportal-update-3-ux-improvements-more-javascript-tutorials-and-more-20180509t045305223z"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"root_title"</span><span class="p">:</span><span class="s2">"DevPortal Update #3: UX Improvements, More Javascript Tutorials and More!"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"pending_payout_value"</span><span class="p">:</span><span class="s2">"0.000 SBD"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"total_pending_payout_value"</span><span class="p">:</span><span class="s2">"0.000 STEEM"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"active_votes"</span><span class="p">:[],</span><span class="w">
            </span><span class="nt">"replies"</span><span class="p">:[],</span><span class="w">
            </span><span class="nt">"author_reputation"</span><span class="p">:</span><span class="s2">"174938588721"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"promoted"</span><span class="p">:</span><span class="s2">"0.000 SBD"</span><span class="p">,</span><span class="w">
            </span><span class="nt">"body_length"</span><span class="p">:</span><span class="mi">0</span><span class="p">,</span><span class="nt">"reblogged_by"</span><span class="p">:[]</span><span class="w">
        </span><span class="p">},</span><span class="w">
        </span><span class="err">{</span><span class="nt">"etc."</span><span class="p">:</span><span class="s2">"etc."</span><span class="p">}</span><span class="w">
    </span><span class="p">}</span><span class="err">,</span><span class="w">
    </span><span class="s2">"accounts"</span><span class="err">:</span><span class="p">{</span><span class="w">
        </span><span class="nt">"steemitblog:{
            "</span><span class="err">etc.</span><span class="nt">":"</span><span class="err">etc.</span><span class="nt">"
        },
    },
    "</span><span class="err">witnesses</span><span class="nt">":{},
    "</span><span class="err">discussion_idx</span><span class="nt">":{},
    "</span><span class="err">witness_schedule</span><span class="nt">":{
        "</span><span class="err">id</span><span class="nt">":0,
        "</span><span class="err">current_virtual_time</span><span class="nt">":"</span><span class="err">326078326927286190874576091</span><span class="nt">",
        "</span><span class="err">next_shuffle_block_num</span><span class="nt">":22307439,
        "</span><span class="err">current_shuffled_witnesses</span><span class="nt">":["</span><span class="err">furion</span><span class="nt">","</span><span class="err">someguy123</span><span class="nt">","</span><span class="err">good-karma</span><span class="nt">","</span><span class="err">blocktrades</span><span class="nt">","</span><span class="err">smooth.witness</span><span class="nt">"],
        "</span><span class="err">num_scheduled_witnesses</span><span class="nt">":21,
        "</span><span class="err">top19_weight</span><span class="nt">":1,
        "</span><span class="err">timeshare_weight</span><span class="nt">":5,
        "</span><span class="err">miner_weight</span><span class="nt">":1,
        "</span><span class="err">witness_pay_normalization_factor</span><span class="nt">":25,
        "</span><span class="err">median_props</span><span class="nt">":{
            "</span><span class="err">account_creation_fee</span><span class="nt">":"</span><span class="err">0.100</span><span class="w"> </span><span class="err">STEEM</span><span class="nt">",
            "</span><span class="err">maximum_block_size</span><span class="nt">":65536,
            "</span><span class="err">sbd_interest_rate</span><span class="nt">":0
        },
        "</span><span class="err">majority_version</span><span class="nt">":"</span><span class="err">0.19.3</span><span class="nt">",
        "</span><span class="err">max_voted_witnesses</span><span class="nt">":20,
        "</span><span class="err">max_miner_witnesses</span><span class="nt">":0,
        "</span><span class="err">max_runner_witnesses</span><span class="nt">":1,
        "</span><span class="err">hardfork_required_witnesses</span><span class="nt">":17
    },
    "</span><span class="err">feed_price</span><span class="nt">":{
        "</span><span class="err">base</span><span class="nt">":"</span><span class="err">3.484</span><span class="w"> </span><span class="err">SBD</span><span class="nt">",
        "</span><span class="err">quote</span><span class="nt">":"</span><span class="err">1.000</span><span class="w"> </span><span class="err">STEEM</span><span class="nt">"
    },
    "</span><span class="err">error</span><span class="nt">":"</span><span class="err">"</span><span class="w">
</span><span class="err">}</span><span class="w">
</span></code></pre>
</div>

<h4 id="3-formatting">3. Formatting<a name="formatting"></a></h4>

<p>Next we will format the above object properly to view in a simple user interface. From the above object, we are only interested in the <code class="highlighter-rouge">content</code> object which holds the data we require.</p>

<div class="language-javascript highlighter-rouge"><pre class="highlight"><code><span class="k">if</span> <span class="p">(</span>
    <span class="o">!</span><span class="p">(</span>
        <span class="nb">Object</span><span class="p">.</span><span class="nx">keys</span><span class="p">(</span><span class="nx">result</span><span class="p">.</span><span class="nx">content</span><span class="p">).</span><span class="nx">length</span> <span class="o">===</span> <span class="mi">0</span> <span class="o">&amp;&amp;</span>
        <span class="nx">result</span><span class="p">.</span><span class="nx">content</span><span class="p">.</span><span class="nx">constructor</span> <span class="o">===</span> <span class="nb">Object</span>
    <span class="p">)</span>
<span class="p">)</span> <span class="p">{</span>
    <span class="kd">var</span> <span class="nx">comments</span> <span class="o">=</span> <span class="p">[];</span>
    <span class="nb">Object</span><span class="p">.</span><span class="nx">keys</span><span class="p">(</span><span class="nx">result</span><span class="p">.</span><span class="nx">content</span><span class="p">).</span><span class="nx">forEach</span><span class="p">(</span><span class="nx">key</span> <span class="o">=&gt;</span> <span class="p">{</span>
        <span class="kr">const</span> <span class="nx">comment</span> <span class="o">=</span> <span class="nx">result</span><span class="p">.</span><span class="nx">content</span><span class="p">[</span><span class="nx">key</span><span class="p">];</span>
        <span class="kr">const</span> <span class="nx">parent_author</span> <span class="o">=</span> <span class="nx">comment</span><span class="p">.</span><span class="nx">parent_author</span><span class="p">;</span>
        <span class="kr">const</span> <span class="nx">parent_permlink</span> <span class="o">=</span> <span class="nx">comment</span><span class="p">.</span><span class="nx">parent_permlink</span><span class="p">;</span>
        <span class="kr">const</span> <span class="nx">created</span> <span class="o">=</span> <span class="k">new</span> <span class="nb">Date</span><span class="p">(</span><span class="nx">comment</span><span class="p">.</span><span class="nx">created</span><span class="p">).</span><span class="nx">toDateString</span><span class="p">();</span>
        <span class="kr">const</span> <span class="nx">body</span> <span class="o">=</span> <span class="nx">md</span><span class="p">.</span><span class="nx">render</span><span class="p">(</span><span class="nx">comment</span><span class="p">.</span><span class="nx">body</span><span class="p">);</span>
        <span class="kr">const</span> <span class="nx">netvotes</span> <span class="o">=</span> <span class="nx">comment</span><span class="p">.</span><span class="nx">net_votes</span><span class="p">;</span>
        <span class="nx">comments</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span>
            <span class="err">`</span><span class="o">&lt;</span><span class="nx">div</span> <span class="kr">class</span><span class="o">=</span><span class="s2">"list-group-item list-group-item-action flex-column align-items-start"</span><span class="o">&gt;\</span>
            <span class="o">&lt;</span><span class="nx">div</span> <span class="kr">class</span><span class="o">=</span><span class="s2">"d-flex w-100 justify-content-between"</span><span class="o">&gt;\</span>
              <span class="o">&lt;</span><span class="nx">h6</span> <span class="kr">class</span><span class="o">=</span><span class="s2">"mb-1"</span><span class="o">&gt;</span><span class="err">@</span><span class="nx">$</span><span class="p">{</span><span class="nx">comment</span><span class="p">.</span><span class="nx">author</span><span class="p">}</span><span class="o">&lt;</span><span class="sr">/h6&gt;</span><span class="err">\
</span>              <span class="o">&lt;</span><span class="nx">small</span> <span class="kr">class</span><span class="o">=</span><span class="s2">"text-muted"</span><span class="o">&gt;</span><span class="nx">$</span><span class="p">{</span><span class="nx">created</span><span class="p">}</span><span class="o">&lt;</span><span class="sr">/small&gt;</span><span class="err">\
</span>            <span class="o">&lt;</span><span class="sr">/div&gt;</span><span class="err">\
</span>            <span class="o">&lt;</span><span class="nx">p</span> <span class="kr">class</span><span class="o">=</span><span class="s2">"mb-1"</span><span class="o">&gt;</span><span class="nx">$</span><span class="p">{</span><span class="nx">body</span><span class="p">}</span><span class="o">&lt;</span><span class="sr">/p&gt;</span><span class="err">\
</span>            <span class="o">&lt;</span><span class="nx">small</span> <span class="kr">class</span><span class="o">=</span><span class="s2">"text-muted"</span><span class="o">&gt;&amp;</span><span class="err">#</span><span class="mi">9650</span><span class="p">;</span> <span class="nx">$</span><span class="p">{</span><span class="nx">netvotes</span><span class="p">},</span> <span class="nx">Replied</span> <span class="na">to</span><span class="p">:</span> <span class="err">@</span><span class="nx">$</span><span class="p">{</span><span class="nx">parent_author</span><span class="p">}</span><span class="sr">/${parent_permlink}&lt;/</span><span class="nx">small</span><span class="o">&gt;\</span>
          <span class="o">&lt;</span><span class="sr">/div&gt;</span><span class="err">`
</span>        <span class="p">);</span>
    <span class="p">});</span>
    <span class="nb">document</span><span class="p">.</span><span class="nx">getElementById</span><span class="p">(</span><span class="s1">'comments'</span><span class="p">).</span><span class="nx">style</span><span class="p">.</span><span class="nx">display</span> <span class="o">=</span> <span class="s1">'block'</span><span class="p">;</span>
    <span class="nb">document</span><span class="p">.</span><span class="nx">getElementById</span><span class="p">(</span><span class="s1">'comments'</span><span class="p">).</span><span class="nx">innerHTML</span> <span class="o">=</span> <span class="nx">comments</span><span class="p">.</span><span class="nx">join</span><span class="p">(</span><span class="s1">''</span><span class="p">);</span>
<span class="p">}</span>
</code></pre>
</div>

<p>We first check if <code class="highlighter-rouge">content</code> is not an empty object. We then iterate through each object in <code class="highlighter-rouge">content</code> and extract:</p>

<ul>
  <li><code class="highlighter-rouge">parent_author</code></li>
  <li><code class="highlighter-rouge">parent_permlink</code></li>
  <li>and the post or comment the <code class="highlighter-rouge">@steemitblog</code> account is replying to</li>
</ul>

<p>We format <code class="highlighter-rouge">created</code> date and time, parse <code class="highlighter-rouge">body</code> markdown and get <code class="highlighter-rouge">net_votes</code> on that comment.
Each line is then pushed and displayed separately.</p>

<h3 id="to-run-the-tutorial">To Run the tutorial</h3>

<ol>
  <li>clone this repo</li>
  <li><code class="highlighter-rouge">cd tutorials/09_get_account_comments</code></li>
  <li><code class="highlighter-rouge">npm i</code></li>
  <li><code class="highlighter-rouge">npm run dev-server</code> or <code class="highlighter-rouge">npm run start</code></li>
  <li>After a few moments, the server should be running at <a href="http://localhost:3000/">http://localhost:3000/</a></li>
</ol>

<hr />

</section>

</div>
<div class="footer">
	<a href="#">Back to top</a>
</div>
<script>
    document.getElementById("open-nav").addEventListener("click", function () {
        document.body.classList.toggle("nav-open");
    });
</script>
</body>
</html>


<script src="/js/adjust.js"></script>

